/* eslint-disable react/jsx-key */
import { doFetch, getFetch } from '@/utils/doFetch';
import { useRequest } from 'ahooks';
import React, { useState, useEffect, useRef } from 'react';
import InitForm from '@/components/InitForm';
import { Modal, message, Popconfirm, Tag } from 'antd';
import AutoTable from '@/components/AutoTable';

// small_scale_type	string
// 必须
// 小规模税收优惠类型 month 月度  季度 quarter
// small_scale_value	string
// 必须
// 小规模税收值
// additional_tax	string
// 必须
// 城建税

// education_tax	string
// 必须
// 教育附加税
// stamp_tax	string
// 必须
// 印花税

let defaultFields = {
  small_scale_type: {
    value: null,
    type: 'radio',
    title: '小规模税收优惠类型',
    name: ['small_scale_type'],
    required: true,
    col: { span: 24 },
    options: [
      { label: '月度', value: 'month' },
      { label: '季度', value: 'quarter' },
    ],
  },
  small_scale_value: {
    value: null,
    type: 'inputnumber',
    title: '小规模税收值',
    name: ['small_scale_value'],
    required: true,
    col: { span: 24 },
  },
  additional_tax: {
    value: null,
    type: 'inputnumber',
    title: '城建税',
    name: ['additional_tax'],
    required: true,
    col: { span: 24 },
  },
  education_tax: {
    value: null,
    type: 'inputnumber',
    title: '教育附加税',
    name: ['education_tax'],
    required: true,
    col: { span: 24 },
  },
  stamp_tax: {
    value: null,
    type: 'inputnumber',
    title: '印花税',
    name: ['stamp_tax'],
    required: true,
    col: { span: 24 },
  },
  added_tax_rate: {
    value: [],
    type: 'table',
    title: '增值税税率',
    name: ['added_tax_rate'],
    columns: [
      {
        title: '税率',
        dataIndex: 'tax',
        key: 'tax',
        search: false,
        valueType: 'digit',
        fieldProps: {
          style: {
            width: '100%',
          },
          precision: 2,
        },
        formItemProps: {
          rules: [
            {
              required: true,
              message: '此项是必填项',
            },
          ],
        },
      },
      {
        title: '操作',
        valueType: 'option',
        width: 60,
        render: () => {
          return null;
        },
      },
    ],
    rowKey: 'key',
    required: true,
    col: { span: 24 },
  },
};
function TicketSetting({ route }) {
  const { data, refresh } = useRequest(async () => {
    let res = await getFetch({ url: '/wbn-api/invoice_setting', params: {} });
    return res?.data;
  });
  const [modal, setModal] = useState({
    open: false,
    footer: false,
    onCancel: () => {
      setModal((s) => ({
        ...s,
        open: false,
      }));
    },
  });
  const [fields, setFields] = useState(defaultFields);

  const columns = Object.values(defaultFields)
    ?.map((it) => {
      if (it?.name[0] === 'added_tax_rate') {
        return {
          title: it?.title,
          dataIndex: it?.name[0],
          key: it?.name[0],
          render: (value, row) => {
            return row?.added_tax_rate?.map((it) => <Tag>{it}</Tag>);
          },
        };
      } else {
        return {
          title: it?.title,
          dataIndex: it?.name[0],
          key: it?.name[0],
        };
      }
    })
    .concat({
      title: '操作',
      valueType: 'option',
      width: 100,
      render: (text, record, _, action) => [
        <a
          key={2}
          style={{ color: '#1890ff' }}
          onClick={() => {
            setFields((fields) => {
              for (let i in fields) {
                if (i === 'added_tax_rate') {
                  fields[i].value = record[i]?.map((it, i) => ({
                    tax: it,
                    key: i,
                  }));
                } else {
                  fields[i].value = record[i];
                }
              }
              return { ...fields };
            });
            setModal((s) => ({
              ...s,
              title: '编辑税率',
              open: true,
            }));
          }}
        >
          编辑
        </a>,
      ],
    });

  const actionRef = useRef(),
    ChildRef = null;

  function reload() {
    refresh();
    setModal((s) => ({
      ...s,
      open: false,
    }));
  }
  return (
    <div>
      <AutoTable
        actionRef={actionRef}
        onRef={(node) => (ChildRef = node)}
        pagetitle={route.name}
        columns={columns}
        dataSource={[data ?? {}]}
      />

      <Modal {...modal}>
        <InitForm
          fields={fields}
          submitData={(values) => {
            doFetch({
              url: '/wbn-api/invoice_setting/update_setting',
              params: { ...values, added_tax_rate: values?.added_tax_rate?.map((it) => it?.tax) },
              method: 'PUT',
            }).then((res) => {
              if (res.code === 0) {
                reload();
              }
            });
          }}
        />
      </Modal>
    </div>
  );
}

export default TicketSetting;
